<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt"	uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
   
    
    <title>支付页</title>
	<link rel="stylesheet"  href="${ctx.resource}/css/style.css" type="text/css" />
	<!-- Bootstrap core CSS -->
	<link href="${ctx.resource}/css/bootstrap.min.css" rel="stylesheet">
   <script src="${ctx.resource}/js/jquery-1.7.2.min.js"></script>
   <script src="${ctx.resource}/js/vendor/bootstrap.min.js"></script>
	
    <!--  <script type="text/javascript">   
  	var pageNo = Number(${pageNo}) ;
	var pageCount= Number(${pageCount});
	function search() {
		//把表单的数据进行序列化
		$.ajax({
			url:"${ctx}/order/pay_update_json",
			type:"POST",
			data:{name:$("#name").val(),sex:$("#sex").val(),firstName:$("#firstName").val(),lastName:$("#lastName").val(),
			schoolname:$("#schoolname").val(),email:$("#email").val(),
			fatherName:$("#fatherName").val(),fatherEmail:$("#fatherEmail").val(),fatherPhone:$("#fatherPhone").val(),
			motherName:$("#motherName").val(),motherEmail:$("#motherEmail").val(),motherPhone:$("#motherPhone").val(),
			ifknow:$("#ifknow").val(),ifagree:$("#ifagree").val(),ifhotel:$("#ifhotel").val(),
			pageNo:pageNo},
			dataType:"json",
			success:function(page){
				
				$("#pageCount").html(page.totalPage) ;
				$("#totalCount").html(page.total) ;
				$("#pageNo").html(pageNo);
				
				$("#quxiao").click() ;
				$("#shuju").html(data1) ;
			}
		});
	}
	function up(){
		if(pageNo>=pageCount){
			alert("这是最后一页") ;
			pageNo =pageCount ;
		}else{
			pageNo++ ;
			search() ;
		}
	}
	function down(){
		if(pageNo<=1){
			alert("这是第一页") ;
			pageNo =1 ;
		}else{
			pageNo--;
			search() ;
		}
	}
	function show(pageno){
		pageNo = Number(pageno) ;
		search() ;
	}
</script> 
 <script>
function get(){
var a=opener.document.getElementById("a").value;
alert(a);
}
</script>-->
<script type="application/javascript"> 
$.fn.serializeObject = function()    
{    
   var o = {};    
   var a = this.serializeArray();    
   $.each(a, function() {    
       if (o[this.name]) {    
           if (!o[this.name].push) {    
               o[this.name] = [o[this.name]];    
           }    
           o[this.name].push(this.value || '');    
       } else {    
           o[this.name] = this.value || '';    
       }    
   });    
   return o;    
};  
function onClik(){  
        //var data = $("payform").serializeArray(); //自动将form表单封装成json  
        //alert(JSON.stringify(data));  
        var jsonuserinfo = $('payform').serializeObject();  
        alert(JSON.stringify(jsonuserinfo));  
}  





</script>
<script>
function  btnclick() {
 		window.location.href = "${ctx}/userInfo/userProInfo";
   };
   
</script>
  </head>
  
  <body>
   <%
    	request.setCharacterEncoding("UTF-8");
    	
    	String name=request.getParameter("name");
     %>
     

    
     
<div class="os-2015">




<!--center-->
<div class="pay">
<div class="w">
<div class="pay01">
<!--进度条-->
<ul>
	<li><img src="${ctx.resource}/images/s-select01.jpg" /></li>
	<li>填写个人信息</li>
	<li><img src="${ctx.resource}/images/s-select01.jpg" /></li>
	<li><img src="${ctx.resource}/images/s-select02.jpg" /></li>
	<li><img src="${ctx.resource}/images/s-select01.jpg" /></li>
	<li>支付项目</li>
	<li><img src="${ctx.resource}/images/s-select01.jpg" /></li>
	<li><img src="${ctx.resource}/images/s-select03.jpg" /></li>
	<li><img src="${ctx.resource}/images/s-select01.jpg" /></li>
	<li id="act">完成</li>
	<li><img src="${ctx.resource}/images/s-select04.jpg" /></li>
</ul>
<!--进度条-->
</div>
<form action="${ctx}/order/pay_update_json" id="payform" name="payform" method="POST" target="_blank">
<div class="pay02">
<div class="pay02-bj1"><img src="${ctx.resource}/images/pay-bj01.jpg" /></div>
<div class="pay02-bj2">
<div class="pay02-bj2in">

<table width="1110" border="0" cellspacing="0" cellpadding="0" class="biaodan" >
  <tr>
    <th colspan="3" scope="row" style=" text-align:center;font-size:18px">ASDAN项目信息订单 <Span style="color:#C00;font-size:14px;">请认真核对信息!</Span></th>
    </tr>
  <tr>
    <th colspan="2" scope="row">学生信息</th>
    <td>&nbsp;</td>
  </tr>
  <tr>
  	<input type="hidden" name="uid" id="uid" value="${uid}"/>
  	<th colspan="2" scope="row">学生姓名:<input type="text" name="name" id="name" value="${name}" readOnly="true"/></th>
  	<td>性别:<input type="text" name="sex" id="sex" value="${sex}" readOnly="true"/></td>
  </tr>
  <tr>
  <th colspan="2" scope="row">姓拼音:<input type="text" name="firstName" id="firstName" value="${firstName}"readOnly="true"/></th>
  <td>名拼音:<input type="text" name="lastName" id="lastName" value="${lastName}"readOnly="true"/></td>
  </tr>
  <tr>
    <th colspan="2" scope="row">学校:<input type="text" name="schoolname" id="schoolname" value="${schoolname}" readOnly="true"/></th>
    <td>年级：<input type="text" name="grade" id="grade" value="${grade}" readOnly="true"/></td>
  </tr>
  <tr>
    <th colspan="2" scope="row">邮箱:<input type="text" name="email" id="email" value="${email}" readOnly="true"/></th>
    <td>手机号：<input type="text" name="cellPhone" id="cellPhone" value="${cellPhone}" readOnly="true"/></td>
  </tr>
  <tr>
    <th colspan="2" scope="row">身份证号:<input type="text" name="idCard" id="idCard" value="${idCard}" readOnly="true"/></th>
    <td></td>
  <tr>
  <th scope="row">父母联系方式：</th>
  </tr>
  <tr>
    <th scope="row">父亲姓名:<input type="text" name="fatherName" id="fatherName" value="${fatherName}" readOnly="true"/></th>
    <th scope="row">邮箱：<input type="text" name="fatherEmail" id="fatherEmail" value="${fatherEmail}" readOnly="true"/></th>
    <th scope="row">手机：<input type="text" name="fatherPhone" id="fatherPhone" value="${fatherPhone}" readOnly="true"/></th>
    </tr>
  <tr>
    <th scope="row">母亲姓名:<input type="text" name="motherName" id="motherName" value="${motherName}" readOnly="true"/></th>
    <th scope="row">邮箱：<input type="text" name="motherEmail" id="motherEmail" value="${motherEmail}" readOnly="true"/></th>
    <th scope="row">手机：<input type="text" name="motherPhone" id="motherPhone" value="${motherPhone}" readOnly="true"/></th>
    </tr>
  <tr>
    <th colspan="3" scope="row">父母是否已知晓相关项目信息：<input type="text" name="ifknow" id="ifknow" value="${ifknow}"readOnly="true"/>
         
</th>
    </tr>
  <tr>
    <th colspan="3" scope="row">父母是否已同意参加该项目：<input type="text" name="ifagree" id="ifagree" value="${ifagree}"readOnly="true"/>
      
   </th>
    </tr>
      <tr>
    <th colspan="3" scope="row">是否选择住宿：<input type="text" name="ifhotel" id="ifhotel" value="${ifhotel}"readOnly="true"/>
      
   </th>
    </tr>

</table>

</div>



<div  id="payresult" >
                        
                  </div> <!--Modal fade End-->



<div class="pay02-bj2inn">
<span>参与项目信息</span>
<div class="wenben">
<span class="pig"><img src="${ctx.resource}/images/pay-img01.jpg" /></span>
<span>项目名称:     ${projectname}</span>
<span>开始时间:     ${startTime}</span>
<span>订单价格:     ${price}</span>
</div>
<input  type="hidden" value="${fpid}" name="fpid" />
<input  type="hidden" value="${spid}" name="spid" />
<input  type="hidden" value="${price}" name="price" />
<div style=" clear:both"></div>
<p class="butt"><a href="#" onclick="javascript:window.history.back()">返回上一步编辑信息</a><img src="${ctx.resource}/images/pay-button.jpg" data-toggle="modal" 
   data-target="#myModal" onclick="javascript:document.payform.submit();"  /></p>




</div>
</div>
<div class="pay02-bj1"><img src="${ctx.resource}/images/pay-bj02.jpg" /></div>
</div>
</form> 
</div>
</div>
<div style=" clear:both"></div>
<div style="height:30px;"></div>
</div>


<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-100" role="dialog" 
   aria-labelledby="myModalLabel" aria-hidden="true">
   <div class="modal-dialog">
      <div class="modal-content">
         <div class="modal-header">
            <button type="button" class="close" 
               onclick="btnclick();" aria-hidden="true">
                     请在弹出页完成支付
            </button>
            <h4 class="modal-title" id="myModalLabel">
            支付宝支付
            </h4>
         </div>
         <div class="modal-body">
              <button type="button" id="btn1" class="btn btn-primary" onclick="btnclick();" >
              	 我已经完成了支付
            </button>
            <button type="button" id="btn2"  class="btn btn-primary" onclick="btnclick();" >
             	支付遇到了问题
            </button>

         </div>
         <div class="modal-footer">
                   </div>
      </div><!-- /.modal-content -->
</div><!-- /.modal -->	
   

</body>
</html>
